<template>
  <div v-if="detail" class="full-box shadow-box padding-box">
    <OperateCommon :showBack="true" @back="goBack">
      <template #operate>
        <div
          style="display: inline-block; margin-right: 10px"
          v-if="user.homeRole == 4"
        >
          <el-button v-if="!needFeedback()" @click="operate(10)">
            {{ detail.yellow_know_status == 1 ? "已了解" : "了解" }}
          </el-button>
          <el-button v-if="!needFeedback()" type="primary" @click="operate(20)">
            {{ detail.yellow_know_status == 2 ? "已关注" : "关注" }}
          </el-button>
          <el-button type="warning" @click="operate(30)">督办</el-button>
          <el-button type="danger" @click="operate(40)"> 查处 </el-button>
        </div>
        <div
          style="display: inline-block; margin-right: 10px"
          v-if="user.homeRole == 2 && user.zgbm == 1"
        >
          <el-button v-if="!needFeedback()" type="primary" @click="operate(20)">
            {{ detail.yellow_know_status == 2 ? "已关注" : "关注" }}
          </el-button>
          <el-button type="warning" @click="operate(30)">交办</el-button>
        </div>
        <div
          style="display: inline-block; margin-right: 10px"
          v-if="user.homeRole == 1"
        >
          <el-button v-if="!needFeedback()" type="primary" @click="operate(20)">
            {{ detail.yellow_know_status == 2 ? "已关注" : "关注" }}
          </el-button>
          <el-button type="warning" @click="operate(30)">交办</el-button>
        </div>
      </template>
    </OperateCommon>

    <el-collapse v-model="activeNames" :accordion="false">
      <el-collapse-item
        v-for="item in items"
        :key="item.key"
        :title="item.title"
        :name="item.key"
      >
        <template v-if="item.key == '1'">
          <div class="desc">
            <label>预警项目：</label>
            <span>
              {{ detail.object_name }}
            </span>
          </div>
          <div class="desc">
            <label>建设单位：</label>
            <span>
              {{ detail.responsible_name }}
            </span>
          </div>
          <div class="desc">
            <label>预警单位：</label>
            <span>
              {{ detail.responsible_unit_name }}
            </span>
          </div>
          <div class="desc">
            <label>预警发生时间：</label>
            <span>
              {{ detail.trigger_time }}
            </span>
          </div>
          <div class="desc">
            <label>预警节点：</label>
            <span>
              {{ detail.scene }}
            </span>
          </div>
          <div class="desc">
            <label>预警内容：</label>
            <span>
              {{ detail.warning_content }}
            </span>
          </div>
        </template>
        <!-- 关注反馈 -->
        <template v-if="item.key == '3'">
          <template v-if="detail.yellow_feed_back != ''">
            <div class="desc">
              <label>监管部门：</label>
              <span>
                {{ detail.yellow_know_dept }}
              </span>
            </div>
            <div class="desc">
              <label>责任人：</label>
              <span>
                {{ detail.yellow_feed_user }}
              </span>
            </div>
            <div class="desc">
              <label>情况说明：</label>
              <span>
                {{ detail.yellow_feed_back }}
              </span>
            </div>
            <div class="desc">
              <label>附件：</label>
              <span>
                <CommonUpload
                  :pid="detail.id"
                  tableName="notice-feedback"
                  :useType="'1'"
                  :showUploadBtn="false"
                  :disabled="true"
                ></CommonUpload>
              </span>
            </div>
            <div class="desc">
              <label>反馈时间：</label>
              <span>
                {{ detail.yellow_feed_time }}
              </span>
            </div>
          </template>
          <!-- 反馈表单 -->
          <template v-else>
            <template v-if="needFeedback()">
              <el-form
                :model="noticeForm"
                ref="noticeForm"
                :rules="noticeRules"
                label-width="100px"
                :inline="false"
              >
                <el-form-item label="监管部门">
                  <el-input
                    v-model="detail.yellow_know_dept"
                    disabled
                  ></el-input>
                </el-form-item>
                <el-form-item label="责任人" prop="yellow_feed_user">
                  <el-input v-model="noticeForm.yellow_feed_user"></el-input>
                </el-form-item>
                <el-form-item label="情况说明" prop="yellow_feed_back">
                  <el-input
                    type="textarea"
                    v-model="noticeForm.yellow_feed_back"
                    :autosize="{
                      minRows: 3,
                      maxRows: 6,
                    }"
                  ></el-input>
                </el-form-item>
                <el-form-item label="附件">
                  <CommonUpload
                    :pid="detail.id"
                    tableName="notice-feedback"
                    :useType="'1'"
                  ></CommonUpload>
                </el-form-item>
                <el-form-item label="反馈时间">
                  <el-date-picker
                    v-model="noticeForm.yellow_feed_time"
                    type="date"
                    value-format="yyyy-MM-dd"
                    placeholder="选择日期时间"
                  >
                  </el-date-picker>
                </el-form-item>
                <el-form-item label="">
                  <el-button type="warning" @click="sendNoticeFeedback"
                    >关注反馈</el-button
                  >
                </el-form-item>
              </el-form>
            </template>
            <template v-if="!needFeedback()">
              <el-empty :image-size="80" description="未反馈"></el-empty>
            </template>
          </template>
        </template>
        <!-- 整改 -->
        <template v-if="item.key == '4'">
          <template v-if="detail.warningMendDetail">
            <RectificationDetail :detail="detail"></RectificationDetail>
          </template>
          <template v-else>
            <Rectification :detail="detail" @refresh="initData"></Rectification>
          </template>
        </template>
        <!-- 纪检处置 -->
        <template v-if="item.key == '5'">
          <!-- 处置表单 -->
          <template
            v-if="
              !detail.JJSolveDetail ||
              (detail.JJSolveDetail && detail.JJSolveDetail.status != 1)
            "
          >
            <AlertPunish
              :detail="detail"
              :alertType="'yellow'"
              :fromType="userType"
              @refresh="initData"
            ></AlertPunish>
          </template>
          <!-- 处置结果 -->
          <template
            v-if="detail.JJSolveDetail && detail.JJSolveDetail.status == 1"
          >
            <YellowAlertPuinish
              :detail="detail.JJSolveDetail"
              @transfer="operate(50)"
              @oneCaseThreeCheck="operate(60)"
            ></YellowAlertPuinish>
          </template>
        </template>
        <!-- 主管部门处置 -->
        <template v-if="item.key == '6'">
          <!-- 处置表单 -->
          <template
            v-if="
              !detail.ZGSolveDetail ||
              (detail.ZGSolveDetail && detail.ZGSolveDetail.status != 1)
            "
          >
            <AlertPunish
              :detail="detail"
              :alertType="'yellow'"
              :fromType="userType"
              @refresh="initData"
            ></AlertPunish>
          </template>
          <!-- 处置结果 -->
          <template
            v-if="detail.ZGSolveDetail && detail.ZGSolveDetail.status == 1"
          >
            <YellowAlertPuinish
              :detail="detail.ZGSolveDetail"
              @transfer="continuePunish('transfer')"
              @rectification="continuePunish('rectification')"
              @oneCaseThreeCheck="continuePunish('oneCaseThreeCheck')"
            ></YellowAlertPuinish>
          </template>
        </template>
        <!-- 问题移送 -->
        <template v-if="item.key == '8'">
          <template v-if="detail.warningTransferDetail">
            <QuestionTransferDetail :detail="detail"></QuestionTransferDetail>
          </template>
          <template v-else>
            <QuestionTransfer
              :detail="detail"
              @refresh="initData"
            ></QuestionTransfer>
          </template>
        </template>
          <!-- 一案三查 -->
          <template v-if="item.key == '10'">
              <template v-if="detail.warningCheckDetail">
                  <OneCaseThreeCheckDetail :detail="detail"></OneCaseThreeCheckDetail>
              </template>
              <template v-else>
                  <OneCaseThreeCheck
                      :detail="detail"
                      @refresh="initData"
                  ></OneCaseThreeCheck>
              </template>
          </template>
          <!-- 预警整改反馈详情 -->
          <template v-if="item.key == '11'">
              <div v-if="detail.warningMendDetail.feedbackDetail != null">
                  <div
                      class="history"
                      v-for="(item, index) in detail.warningMendDetail.feedbackDetail"
                      :key="index"
                  >
                      <div class="desc">
                          <label>责任人：</label>
                          <span>
                {{ item.feedback_user_name }}
              </span>
                      </div>
                      <div class="desc">
                          <label>反馈时间：</label>
                          <span>
                {{ item.feedback_date }}
              </span>
                      </div>
                      <div class="desc">
                          <label>整改完成时间：</label>
                          <span>
                {{ item.finish_date }}
              </span>
                      </div>
                      <div class="desc">
                          <label>整改情况：</label>
                          <span>
                {{ item.feedback_content }}
              </span>
                      </div>
                      <div class="desc">
                          <label>附件：</label>
                          <CommonUpload
                              tableName="alert-rectification-feedback"
                              useType="report"
                              :pid="item.id"
                              :showUploadBtn="false"
                              :disabled="true"
                          ></CommonUpload>
                      </div>
                      <div class="desc">
                          <label>建章立制：</label>
                          <span>
                {{ item.create_system }}
                <span>项</span>
              </span>
                      </div>
                      <div class="desc">
                          <label>警示教育：</label>
                          <span>
                {{ item.inculcate }}
                <span>场</span>
              </span>
                      </div>
                      <div class="review-wrapper">
                          <!-- 审核情况 审核者 -->
                          <div v-if="item.check_status == 0 && pageType == 1">
                              <el-form
                                  :model="reviewForm"
                                  ref="reviewForm"
                                  :rules="reviewRules"
                                  label-width="150px"
                              >
                                  <el-form-item label="审核意见" prop="">
                                      <el-input
                                          type="textarea"
                                          v-model="reviewForm.opinion"
                                          :autosize="{
                        minRows: 3,
                        maxRows: 6,
                      }"
                                      ></el-input>
                                  </el-form-item>
                                  <el-form-item label="">
                                      <el-button type="success" @click="review(item, 1)"
                                      >通过</el-button
                                      >
                                      <el-button type="danger" @click="review(item, 2)"
                                      >退回</el-button
                                      >
                                  </el-form-item>
                              </el-form>
                          </div>
                          <!-- 已审核 -->
                          <div v-if="item.check_status != 0">
                              <div class="desc">
                                  <label>审核人：</label>
                                  <span>
                    {{ item.check_user_name }}
                  </span>
                              </div>
                              <div class="desc">
                                  <label>审核结果：</label>
                                  <span>
                    <el-tag
                        size="mini"
                        effect="dark"
                        :type="item.check_status == 1 ? 'success' : 'danger'"
                        :closable="false"
                    >
                      {{ item.check_status_text }}</el-tag
                    >
                  </span>
                              </div>
                              <div class="desc">
                                  <label>审核意见：</label>
                                  <span>
                    {{ item.opinion }}
                  </span>
                              </div>
                              <div class="desc">
                                  <label>审核时间：</label>
                                  <span>
                    {{ item.check_time }}
                  </span>
                              </div>
                          </div>
                          <!-- 审核情况 反馈者 -->
                          <div
                              class="unreview"
                              v-if="item.check_status == 0 && pageType == 0"
                          >
                              <b> 未审核 </b>
                          </div>
                      </div>
                  </div>
              </div>
          </template>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
import CommonUpload from "@/components/Common/CommonUpload.vue";
import OperateCommon from "@/components/Common/OperateCommon.vue";
import LinkTo from "@/mixins/LinkTo";
import DeptCascader from "@/components/Common/DeptCascader.vue";
import uploadMixin from "@/components/GenerateForm/uploadMixin";
import {
  getYellowAlertDetail,
  postNoticeFeedback,
  postYellowAlertOperate,
} from "@/api/YellowAlert/Index";
import AlertPunish from "../RedAlert/components/AlertPunish.vue";
import YellowAlertPuinish from "./components/YellowAlertPuinish.vue";
import RectificationDetail from "../RedAlert/components/RectificationDetail.vue";
import Rectification from "../RedAlert/components/Rectification.vue";
import QuestionTransferDetail from "../RedAlert/components/QuestionTransferDetail.vue";
import QuestionTransfer from "../RedAlert/components/QuestionTransfer.vue";
import OneCaseThreeCheckDetail from "../RedAlert/components/OneCaseThreeCheckDetail.vue";
import OneCaseThreeCheck from "../RedAlert/components/OneCaseThreeCheck.vue";
import { required } from "@/utils/eValidate";
import { getCurrentDate } from "@/utils/date";
export default {
  name: "YellowAlertDetails",
  mixins: [LinkTo, uploadMixin],
  components: {
    CommonUpload,
    OperateCommon,
    DeptCascader,
    AlertPunish,
    YellowAlertPuinish,
    RectificationDetail,
    Rectification,
    QuestionTransferDetail,
    QuestionTransfer,
    OneCaseThreeCheckDetail,
    OneCaseThreeCheck,
  },
  data() {
    return {
      id: 0,
      detail: null,
      items: [
        {
          key: "1",
          title: "预警信息",
        },
      ],
      activeNames: ["1"],
      userType: 0,
      // 1 部门（1主管0下级） 2 纪委
      user: JSON.parse(localStorage.getItem("user")) || "",
      noticeForm: {
        yellow_feed_back: "",
        yellow_feed_user: "",
        yellow_feed_time: getCurrentDate(),
      },
      noticeRules: {
        yellow_feed_back: [required],
        yellow_feed_user: [required],
      },
    };
  },
  methods: {
    initData() {
      getYellowAlertDetail({ id: this.id }).then((res) => {
        if (res.code == 0) {
          this.detail = res.data;
          this.checkContinueStep();
        }
      });
    },
    goBack() {
      this.linkTo(`/yellowAlert/manage`);
    },
    operate(status) {
      switch (parseInt(status)) {
        case 10:
          this.knowAlert();
          break;
        case 20:
          this.followOrCancel();
          break;
        case 30:
          if (
            this.items.findIndex((i) => {
              return i.key === "4";
            }) === -1
          ) {
            let newArr = JSON.parse(JSON.stringify(this.items));
            newArr.push({
              key: "4",
              title: this.userType == 2 ? "整改督办" : "交办单",
            });
            this.items = newArr;
          }
          this.activeNames = ["4"];
          break;
        case 40:
          if (this.userType == 1) {
            this.zgPunish();
          } else {
            this.dcPunish();
          }
          break;
        case 50:
          if (
            this.items.findIndex((i) => {
              return i.key === "8";
            }) === -1
          ) {
            let newArr = JSON.parse(JSON.stringify(this.items));
            newArr.push({
              key: "8",
              title: "问题移送",
            });
            this.items = newArr;
          }
          this.activeNames = ["8"];
          break;
        case 60:
          if (
            this.items.findIndex((i) => {
              return i.key === "10";
            }) === -1
          ) {
            let newArr = JSON.parse(JSON.stringify(this.items));
            newArr.push({
              key: "10",
              title: "一案三查",
            });
            this.items = newArr;
          }
          this.activeNames = ["10"];
          break;
      }
    },
    dcPunish() {
      if (
        this.items.findIndex((i) => {
          return i.key === "5";
        }) === -1
      ) {
        let newArr = JSON.parse(JSON.stringify(this.items));
        newArr.push({
          key: "5",
          title: "纪检处置",
        });
        this.items = newArr;
      }
      this.activeNames = ["5"];
    },
    zgPunish() {
      if (
        this.items.findIndex((i) => {
          return i.key === "6";
        }) === -1
      ) {
        let newArr = JSON.parse(JSON.stringify(this.items));
        newArr.push({
          key: "6",
          title: "主管部门处置",
        });
        this.items = newArr;
      }
      this.activeNames = ["6"];
    },
    knowAlert() {
      postYellowAlertOperate({
        id: this.detail.id,
        yellow_know_status: 1,
      }).then((res) => {
        if (res.code == 0) {
          this.$message.success("操作成功");
          this.initData();
        }
      });
    },
    followOrCancel() {
      postYellowAlertOperate({
        id: this.detail.id,
        yellow_know_status: 2,
      }).then((res) => {
        if (res.code == 0) {
          this.$message.success("操作成功");
          this.initData();
        }
      });
    },
    checkContinueStep() {
      if (this.detail.yellow_know_status == 2) {
        if (
          this.items.findIndex((i) => {
            return i.key === "3";
          }) === -1
        ) {
          this.items.push({
            key: "3",
            title: "关注反馈",
          });
        }
      }
      if (this.detail.warningMendDetail) {
          if (
              this.items.findIndex((i) => {
                  return i.key === "4";
              }) === -1
          ) {
              if (this.userType == 2) {
                  this.items.push({
                      key: "4",
                      title: "整改督办",
                  });
              }
              if (this.userType == 1) {
                  this.items.push({
                      key: "4",
                      title: "交办单",
                  });
              }
          }
          this.items.push({
              key: "11",
              title: "预警整改反馈详情",
          });
      }
      if (this.detail.JJSolveDetail) {
        if (
          this.items.findIndex((i) => {
            return i.key === "5";
          }) === -1
        ) {
          this.items.push({
            key: "5",
            title: "纪检处置",
          });
        }
      }
      if (this.detail.ZGSolveDetail) {
        if (
          this.items.findIndex((i) => {
            return i.key === "6";
          }) === -1
        ) {
          this.items.push({
            key: "6",
            title: "主管部门处置",
          });
        }
      }
      if (this.detail.warningCheckDetail) {
        if (
          this.items.findIndex((i) => {
            return i.key === "10";
          }) === -1
        ) {
          this.items.push({
            key: "10",
            title: "问题移送",
          });
        }
      }
      if (this.detail.warningTransferDetail) {
        if (
          this.items.findIndex((i) => {
            return i.key === "8";
          }) === -1
        ) {
          this.items.push({
            key: "8",
            title: "问题移送",
          });
        }
      }
    },
    sendNoticeFeedback() {
      this.$refs.noticeForm[0].validate((valid) => {
        if (valid) {
          this.noticeForm.id = this.detail.id;
          postNoticeFeedback(this.noticeForm).then((res) => {
            if (res.code == 0) {
              this.$message.success("情况说明成功");
              this.initData();
            }
          });
        }
      });
    },
    needFeedback() {
      if (
        this.detail.yellow_know_status == 2 &&
        this.detail.responsible_unit_name.trim() == this.user.dept_name.trim()
      ) {
        return true;
      }
      return false;
    },
    checkUserType() {
      let user = JSON.parse(localStorage.getItem("user"));

      switch (parseInt(user.homeRole)) {
        case 1:
          this.userType = 1;
          break;
        case 2:
          this.userType = 1;
          break;
        case 3:
          this.userType = 2;
          break;
        case 4:
          this.userType = 2;
          break;
        default:
          break;
      }
    },
  },
  created() {
    this.id = this.$route.params.id;

    this.checkUserType();

    this.initData();
  },
};
</script>

<style lang="scss" scoped>
.review-wrapper {
    margin-top: 10px;
    box-sizing: border-box;
    padding: 10px 0;
    border-top: 2px dashed #ccc;
    > label {
        font-weight: 600;
        font-size: 16px;
    }
}
</style>
